<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String basePath = request.getScheme()+"://"+request.getServerName()
		+ ":"+ request.getServerPort() + request.getContextPath() + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath %>">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<title>VMALL-后台管理系统</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<body class="layui-layout-body">
	<div class="layui-layout layui-layout-admin">
		<div class="layui-header">
			<div class="layui-logo">VMALL-后台管理系统</div>
			<!-- 头部区域（可配合layui已有的水平导航） -->
			<ul class="layui-nav layui-layout-left">
				<li class="layui-nav-item"><a href="">控制台</a></li>
				<li class="layui-nav-item"><a href="">商品管理</a></li>
				<li class="layui-nav-item"><a href="">用户</a></li>
				<li class="layui-nav-item"><a href="javascript:;">其它系统</a>
					<dl class="layui-nav-child">
						<dd>
							<a href="">邮件管理</a>
						</dd>
						<dd>
							<a href="">消息管理</a>
						</dd>
						<dd>
							<a href="">授权管理</a>
						</dd>
					</dl></li>
			</ul>
			<ul class="layui-nav layui-layout-right">
				<li class="layui-nav-item">
					<a href="javascript:;">
						<c:if test="${sessionScope.admin.photo == null }">
							<img src="upload/default_photo.jpg" class="layui-nav-img">
						</c:if>
						<c:if test="${sessionScope.admin.photo != null }">
							<img src="upload/${sessionScope.admin.photo }" class="layui-nav-img">
						</c:if>
						${sessionScope.admin.realname }
					</a>
					<dl class="layui-nav-child">
						<dd><a href="javascript:;" class="modify">修改资料</a></dd>
						<dd><a href="javascript:;" class="modify-pwd">修改密码</a></dd>
					</dl>
				</li>
				<li class="layui-nav-item"><a href="admin/logout.do">退出</a></li>
			</ul>
		</div>

		<div class="layui-side layui-bg-black">
			<div class="layui-side-scroll">
				<!-- 左侧导航区域（可配合layui已有的垂直导航） -->
				<ul class="layui-nav layui-nav-tree" lay-filter="test">
					<li class="layui-nav-item layui-nav-itemed">
						<a class="" href="javascript:;">商品管理</a>
						<dl class="layui-nav-child">
							<dd><a href="javascript:;" data-url="admin/goods/index.do">商品列表</a></dd>
							<dd><a href="javascript:;" data-url="admin/goods/add.do">添加商品</a></dd>
						</dl>
					</li>
					<li class="layui-nav-item layui-nav-itemed">
						<a class="" href="javascript:;">订单管理</a>
						<dl class="layui-nav-child">
							<dd><a href="javascript:;">订单列表</a></dd>
						</dl>
					</li>
					<li class="layui-nav-item layui-nav-itemed">
						<a class="" href="javascript:;">商品分类</a>
						<dl class="layui-nav-child">
							<dd><a href="javascript:;" data-url="admin/type/index.do">分类列表</a></dd>
							<dd><a href="javascript:;" data-url="admin/type/add.do">添加分类</a></dd>
						</dl>
					</li>
					<li class="layui-nav-item layui-nav-itemed">
						<a class="" href="javascript:;">用户管理</a>
						<dl class="layui-nav-child">
							<dd><a href="javascript:;">用户列表</a></dd>
						</dl>
					</li>
					<li class="layui-nav-item layui-nav-itemed">
						<a class="" href="javascript:;">管理员管理</a>
						<dl class="layui-nav-child">
							<dd><a href="javascript:;">管理员列表</a></dd>
							<dd><a href="javascript:;">添加管理员</a></dd>
						</dl>
					</li>
				</ul>
			</div>
		</div>

		<div class="layui-body">
			<!-- 内容主体区域 -->
			<div style="padding: 15px;">内容主体区域</div>
		</div>

		<div class="layui-footer">
			<!-- 底部固定区域 -->
			© lzw.com - 这是一个固定区域
		</div>
	</div>
	<script src="layui/layui.js"></script>
	<script>
		//JavaScript代码区域
		layui.use('element', function() {
			var element = layui.element;
			//取出内置的jQuery
			$ = layui.jquery;

			//修改密码
			$(".modify-pwd").click(function(){
				gotoURL("admin/modifyPwd.do");
			});
			//修改资料
			$(".modify").click(function(){
				gotoURL("admin/modify.do");
			});
			
			$(".layui-nav-tree dd a").click(function(){
				var url = $(this).attr("data-url");
				gotoURL(url);
			});
			
		});
		
		function gotoURL(url){
			//使用Ajax请求页面并加载到主体区域
			$.ajax({
				url : url,
				data : {},
				type : "get",
				dataType : "html",
				success : function(data){
					$(".layui-body>div").html(data);
				},
				error : function(){
					console.log("请求失败");
				}
			});
		};
	</script>
</body>
</html>